<template>
    <div class="base-width header">
    <div>
        <div class="left">
            <img src="../assets/img/48.png" alt="">
        </div>
        <div class="right">
            <a href="">登录</a>
        </div>
    </div>
</div>  
</template>

<script>
    export default {
        
    }
</script>

<style lang="scss" scoped>
div{
    display: flex;
}
.base-width.header {
    padding: 20px 0;
    cursor: pointer;
    flex-direction: column;
    >div {
        align-items: center;
        justify-content: space-between;
        >.left {
            width: 25%;
            align-items: center;
            >img {
                display: inline-block;
                width: 150px;
                height: 70px;
            }

        }

        >.right {
            widows: 25%;
            align-items: center;

            >a {
                color: #777;
                padding: 5px;
            }

            &:hover {
                >a {
                    color: red;
                }
            }

        }
    }
}
</style>